<template>
  <div>
    <el-card>
      <el-form :model="form" size="mini" label-position="top" ref="form">
        <el-row :gutter="10">
          <el-col :lg="4" :md="6">
            <el-form-item label="开始日期" prop="STARTDAY">
              <el-date-picker size="mini" style="width:100%;" v-model="form.STARTDAY" type="date"
                value-format="yyyyMMdd" placeholder="开始日期" :picker-options="pickerOptionsStart" @change="changeStart">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="结束日期" prop="ENDDAY">
              <el-date-picker style="width:100%;" size="mini" v-model="form.ENDDAY" type="date" value-format="yyyyMMdd"
                placeholder="结束日期" :picker-options="pickerOptionsEnd" @change="changeEnd">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="批次流水" prop="BATCHSERIALNO">
              <el-input v-model="form.BATCHSERIALNO" placeholder="请输入批次流水" ></el-input>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="交易类型" prop="TRANSTYPE">
              <el-select size="mini" v-model="form.TRANSTYPE" @change="queryData" placeholder="请选择交易类型"
                style="width:100%;">
                <el-option v-for="item in TRANSList" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :lg="4" :md="6">
            <el-form-item label="处理状态" prop="DEALSTATUS">
              <el-select size="mini" clearable v-model="form.DEALDEALSTATUS" @change="queryData" placeholder="请选择申请状态"
                style="width:100%;">
                <el-option v-for="item in statusOption" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </el-form-item>
          </el-col>
          
          <el-col :lg='24' :md='12' style="margin-top:8px;">
            <el-button type="primary" icon="el-icon-search" size='mini' @click="queryData">查询
            </el-button>
            <el-button type="warning" size="mini" icon="el-icon-refresh" @click="resetForm('form')">重置</el-button>
            <el-button type="success" size="mini" icon="el-icon-upload2" @click="openInsert">导入原始数据</el-button>
          </el-col>
        </el-row>
      </el-form>
      <br />
      <el-row>
        <el-table :data="tableData">
         <el-table-column prop="TRANSDATE" label="交易日期" align="center" width="120"></el-table-column>
          <el-table-column prop="TRANSCHANNELSERNO" label="交易渠道流水" align="center" width="120" ></el-table-column>
          <el-table-column prop="TRANSCHANNEL" label="交易所属渠道" align="center" ></el-table-column>
          <el-table-column prop="TRANSCODE" label="交易码" align="center" ></el-table-column>
          <el-table-column prop="TRANSNAME" label="交易名称" align="center" ></el-table-column>
          <el-table-column prop="TRANSTYPE" label="交易类型" align="center" ></el-table-column>
          <el-table-column prop="TRANSSTARTTIME" label="交易开始时间" align="center" ></el-table-column>
          <el-table-column prop="TRANSENDTIME" label="交易结束时间" align="center" ></el-table-column>
          <el-table-column prop="TRANSENDTIME" label="交易结束时间" align="center" ></el-table-column>
          <el-table-column prop="TRANSLENGTH" label="交易时长" align="center" ></el-table-column>
          <el-table-column prop="BRNO" label="机构号" align="center" ></el-table-column>
          <el-table-column prop="TELLERNO" label="柜员号" align="center" ></el-table-column>
          <el-table-column prop="WEEKDAY" label="星期" align="center" ></el-table-column>
          <el-table-column prop="ISHOLIDAY" label="是否节假日" align="center" ></el-table-column>
          <el-table-column prop="ISPEAKDAY" label="是否高峰日" align="center" ></el-table-column>
          <el-table-column prop="DEALSTATUS" label="处理状态" align="center" ></el-table-column>

        </el-table>
        <div style="text-align:right;margin-top:20px;" v-show="this.tableData">
        <el-pagination style="text-align: right; margin-top:20px;" 
          :page-sizes="[10, 20, 50, 100]" 
          :page-size="pageSize" 
          @size-change="handleInSizeChange" 
          @current-change="handleInCurrentChange" 
          :current-page="currentPage" 
          background layout="sizes, total, prev, pager, next, jumper" 
          :total="tableTotal">
        </el-pagination>
      </div>
      </el-row>
    </el-card>
          <component :is="dialogList.excelToJson" :option="dialogExcelOptions" @ListenSuccess="queryData"></component>

  </div>
</template>

<script>
 
  import request from "@/common/utils/requestWFM";
  import moment from 'moment';
  import toolBox from '@/common/utils/toolBox'
  import excelToJson from "./dialog/excelToJson";
  import query from '@/message/wfm/FTEForecast/originalBusinessData/dataQuery'
  export default {
    
    filters:{
      timeFormat(val){
        if(val == ''){
          return ''
        }
        return toolBox.timeFormat(val)
      },
    },
    data() {
      return {
         dialogExcelOptions:{
          isShow: false,
        },
        dialogList: {
          excelToJson
        },
        tableTotal: 1,
        currentPage: 1,
        pageSize: 10,
        pickerOptionsStart: {
          disabledDate: (time) => {
            return time.getTime() > Date.now()
          }
        },
        pickerOptionsEnd: {
          disabledDate: (time) => {
            return time.getTime() > Date.now()
          }
        },
        form: { //表单数据
          STARTDAY: this.getDay(-30),
          ENDDAY: this.getDay(0),
          BATCHSERIALNO: '',
          TRANSTYPE: '',
          DEALSTATUS: ''
        },
        tableData: [],
        TRANSList: [{
            label: '对私',
            value: '01'
          },
          {
            label: '对公',
            value: '02'
          }
        ],
        statusOption: [
          {
            label: '成功',
            value: '1'
          },
          {
            label: '失败',
            value: '2',
          }
        ]
      }
    },
    created(){
    },
    mounted() {
      // 查询原始数据
      this.queryData();
    },
    methods: {
      // 打开导入原始数据
      openInsert(){
        this.dialogExcelOptions.isShow = true;
      },
      // 获取当天前一天
      getDay(day) {
        var dd = new Date();
        dd.setDate(dd.getDate() + day);
        var y = dd.getFullYear();
        var m = dd.getMonth() + 1 < 10 ? "0" + (dd.getMonth() + 1) : dd.getMonth() + 1;
        var d = dd.getDate() < 10 ? "0" + dd.getDate() : dd.getDate();
        return y + "" + m + "" + d;
      },
       //前端分页
      handleInCurrentChange(val) {
        this.currentPage = val;
        this.queryData();
      },
      handleInSizeChange(val) {
        this.pageSize = val;
        this.queryData();
      },
      getBranch(data) {
        this.form.branch.BRANCHNO = data.BRANCHNO
        this.form.branch.BRANCHNAME = data.BRANCHNAME
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      },
      changeStart() {
        this.pickerOptionsEnd = Object.assign({}, this.pickerOptionsEnd, {
          disabledDate: (time) => {
            if (this.form.STARTDAY) {
              return time.getTime() < Date.parse(this.form.STARTDAY.slice(0, 4) + '-' + this.form
                .STARTDAY.slice(4, 6) +
                '-' + this.form.STARTDAY.slice(6, 8)) - 8.64e7
            } else {
              return time.getTime() < Date.now();
            }
          }
        })
      },
      changeEnd() {
        this.pickerOptionsStart = Object.assign({}, this.pickerOptionsStart, {
          disabledDate: (time) => {
            if (this.ruleForm.ENDDAY) {
              return time.getTime() > Date.parse(this.ruleForm.ENDDAY.slice(0, 4) + '-' + this.ruleForm
                .ENDDAY
                .slice(4, 6) + '-' +
                this.ruleForm.ENDDAY.slice(6, 8)) || time.getTime() > Date.now();
            } else {
              return time.getTime() > Date.now();
            }
          }
        })
      },
      // 查询原始数据
      async queryData() {
        let resBody = new query();
        resBody.data.STARTDAY = this.form.STARTDAY;
        resBody.data.ENDDAY = this.form.ENDDAY;
        resBody.data.BATCHSERIALNO = this.form.BATCHSERIALNO;
        resBody.data.DEALSTATUS = this.form.DEALSTATUS;
        resBody.data.TRANSTYPE = this.form.TRANSTYPE;
        resBody.data.ENDDAY = this.form.ENDDAY;
        resBody.data.CurrPage = this.currentPage
        resBody.data.PageRowNum = this.pageSize
        let response = await request(resBody);
        if (response.SYS_HEAD.ReturnCode == '000000') {
          this.tableData = response.BODY.struct
          this.tableTotal = response.BODY.TotalRowNum              
        }else {
          this.$message({
            type: "error",
            message: "请求失败，错误码:" + response.SYS_HEAD.ReturnCode + "，错误信息：" + response.SYS_HEAD.ReturnMessage
          })
        }
      },
    }
  }

</script>

<style lang='scss' scoped>

</style>
